iT邦幫忙

2025 iThome 鐵人賽

DAY 10
0
自我挑戰組

網頁設計自我挑戰 - 從零開始系列 第 10

小總結與反思:我的網頁設計初體驗

  • 分享至 

  • xImage
  •  

已經完成30天挑戰的第一階段。這10天,從零開始,認識了 HTML的基本標籤、CSS的樣式設定,學會如何用盒模型控制空間,打造一個簡單的導覽列。

第一階段學習重點:

  • HTML:

    • 網頁的基本架構 (<html>, <head>, <body>)
    • 常用標籤 (<h1>, <p>, <a>, <img>, <ul>, <table>)
    • 區塊劃分 (<div>, <span>)
  • CSS:

    • 三種引用方式(外部、內部、行內)
    • 基本屬性(color, background-color, font-size, text-align
    • 核心概念:盒模型 (margin, border, padding)
    • 如何用 CSS 打造導覽列

反思與心得:
這10天下來,我發現網頁設計並不像想像中那麼難以親近。只要掌握了基本的 HTML結構和 CSS樣式,就能做出一個功能齊全的靜態網頁。從一開始的空白文件,到現在有顏色、有排版、有導覽列的頁面,這種成就感讓我看到每天的努力和進步是值得的。

當然,也遇到了一些小困難,比如排版時常常會搞錯 marginpadding 的差別,但透過不斷地嘗試和使用開發者工具檢查,都能慢慢釐清。

現在,我已經對網頁設計有了初步的認識,準備好迎接第二階段的挑戰。接下來的10天,我將學習更進階的排版技巧和互動效果,讓網頁變得更專業。


上一篇
連結的大腦:用 CSS 打造漂亮的導覽列
下一篇
排版:Flexbox 彈性盒模型入門
系列文
網頁設計自我挑戰 - 從零開始26
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言